<template>
	<view>
		<Navbar></Navbar>
		<view class="u-m-20 u-m-t-30">
			<view class="u-card-box u-m-t-30" v-for="item in list" :key="item.id">
				<view class="u-flex u-row-between u-col-top">
					<view class="u-flex-1">
						<span
							:class="item.status == 1 ? 'success_tag' : 'fail_tag'">{{ item.status == 0 ? '申请中' : (item.status == 1 ? '已发放' : '审核不通过')}}</span>
						<span class="u-m-l-15 u-font-bold u-font-30 u-text-line-15">提现</span>
					</view>
					<view class="u-font-30 u-font-bold u-color-red u-m-l-10">+{{item.num}}</view>
				</view>
				<view class="u-m-t-10 u-color-gray">收款账户：{{item.bank_account}}</view>
				<view class="u-m-t-10 u-color-gray">{{item.create_time}}</view>
			</view>
		</view>
		<view style="height: 100rpx;"></view>
		<Loadmore :status="status"></Loadmore>
		<Bottom :isReturn="true"></Bottom>
	</view>
</template>

<script>
	import Navbar from "@/components/Navbar.vue";
	import Bottom from "@/components/Bottom.vue";
	import Loadmore from '@/components/Loadmore.vue'
	import reachBottom from '@/mixins/reachBottom.js'
	import { teaCashOutList } from '@/network/tea.js'
	export default {
		mixins: [reachBottom],
		components: {
			Navbar,
			Bottom,
			Loadmore
		},
		data() {
			return {
				list: []
			}
		},
		onLoad() {
			this.onGetList()
		},
		methods:{
			async onGetList(){
				const params = {
					user_id: uni.getStorageSync("user_id"),
					page: this.page,
					limit: 20
				}
				const res = await teaCashOutList(params)
				this.total = res.data.num
				this.count = res.data.count
				res.data.list.map(item=>this.list.push(item))
				if(this.list.length == this.count){
					this.status = 'nomore'
				}
			},
			loadData(){
				if(this.status == 'nomore')return
				this.page++
				this.status = 'loadmore'
				this.onGetList()
			}
		}
	}
</script>

<style scoped>
	.fail_tag {
		font-size: 23rpx;
		background: #F84D3F;
		color: #FFF;
		padding: 5rpx 10rpx;
		border-radius: 8rpx;
	}
	
	.success_tag {
		font-size: 23rpx;
		background: #0CB43D;
		color: #FFF;
		padding: 5rpx 10rpx;
		border-radius: 8rpx;
	}
</style>